import React from 'react'
import { useDispatch ,  useSelector} from 'react-redux' //获取数据推送数据
import { increment , decrement } from '../../store/slice/countSlice'

export default function Count() {
  const dispatch = useDispatch();
  const count = useSelector((state) => state.count.count)
  const movieList = useSelector((state) => state.movie.movieList)

  //累加
  const incrementHandle = () => {
    console.log(increment);
    dispatch(increment(10))
  }

  //累减
  const decrementHandle = () => {
    dispatch(decrement(5))
  }

  //基数累减
  const ifOddDecrementHandle = () => {
    if (count % 2 !== 0) {
      dispatch(decrement(1))
    }
  }

  // /等待2秒累加
  const waitincrementHandle = () => {
    dispatch(increment(10))

  }

  return (
    <div>
      <h1>我是Count组件我的count值是{count}</h1>
      <p>Movie组件的电影条数是{ movieList.length }</p>
      <button onClick={incrementHandle}>累加</button>
      <button onClick={decrementHandle}>累减</button>
      <button onClick={ifOddDecrementHandle}>基数累减</button>
      <button onClick={waitincrementHandle}>等待2秒累加</button>
    </div>
  )
}
